import React, { Component } from 'react'
import './Details.css'
import { Checkbox, Input } from 'antd';
import type { CheckboxChangeEvent } from 'antd/es/checkbox';
import service from '../../../utils/service';
const { TextArea } = Input;
export default class Immediately extends Component<any, any> {
    constructor(props: any) {
        super(props)
        this.state = {
            agree: '',
            refuse: '',
            suggests: ''
        }
    }
    // 发请求修改rove，审批状态的结果,添加建议的话一个是加，一个是改发两个请求
    run = () => {
        // 这个是修改审批状态
        service({
            url: `/teacher/${this.props.location.query.record.id}`,
            method: 'patch',
            data: {
                rove: this.state.agree,
                suggest: this.state.suggests
            }
        })
        // service({
        //     url: `/teacher/${this.props.location.query.record.id}`,
        //     method: 'patch',
        //     data: {
        //         suggest: this.state.suggests
        //     }
        // })
        this.props.history.push('/Main/Leave/Approve')
    }
    run1 = () => {
        this.props.history.push('/Main/Leave/Approve')
    }

    render() {
        return (
            <div>
                <h4>请假详情</h4>
                <div className='box-imm'>
                    <p className='txt1'>请假人：&nbsp;&nbsp;&nbsp;<span>{this.props.location.query.record.xm}</span></p>
                    <p className='txt1'>请假类型：&nbsp;&nbsp;&nbsp;<span>{this.props.location.query.record.caus}</span></p>
                    <p className='txt1'>请假时间：&nbsp;&nbsp;&nbsp;<span>{this.props.location.query.record.start} ~ {this.props.location.query.record.end}</span></p>
                    <p className='txt1'>申请时间：&nbsp;&nbsp;&nbsp;<span>{this.props.location.query.record.start}</span></p>
                    <p className='txt1'>请假原因：&nbsp;&nbsp;&nbsp;<span>{this.props.location.query.record.yy}</span></p>
                    <p className='txt1'>审批状态：&nbsp;&nbsp;&nbsp;<span style={{ color: '#FF6600' }}>{this.props.location.query.record.rove}</span></p>
                    <p className='txt1'>附件：&nbsp;&nbsp;&nbsp;<span>暂无</span></p>
                    <p className='txt1'>请假审批：&nbsp;&nbsp;&nbsp;
                        <Checkbox onChange={(e) => { e.target.checked === true ? this.setState({ agree: '审批通过' }) : this.setState({ refuse: '审批驳回' }) }}>同意</Checkbox>
                        <Checkbox onChange={(e) => { e.target.checked === true ? this.setState({ agree: '审批驳回' }) : this.setState({ refuse: '审批通过' }) }}>不同意</Checkbox>
                    </p>
                    {/*   */}
                    <p className='txt1' style={{ width: '360px' }}>审批意见：<TextArea rows={4} style={{ marginLeft: '90px' }} onChange={(e: any) => { this.setState({ suggests: e.target.value }) }} /></p>
                    <button className='run' onClick={this.run}>确定</button>
                    <button className='run1' onClick={this.run1}>取消</button>
                </div>
            </div>
        )
    }
}
